@mixin mask{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.45);
}

@mixin text-ellipsis{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 文字溢出 2行 (可以写成函数的) */
@mixin text-ellipsis-2 {
  word-break: break-all;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

@mixin text-ellipsis-3 {
  word-break: break-all;
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

@mixin border-radius-normal {
  border-radius: 4px;
}

// 卡片列表
@mixin dynamic-card-list($minCount: 1, $itemClass: 'dynamic-card-list__item') {
  --min-count: #{$minCount};
  width: 100%;
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: space-between;

  &::after {
    content: '';
    flex: auto;
  }

  .#{$itemClass} {
    --cur-count: var(--min-count, 1);
    margin-bottom: 12px;
    margin-right: 12px;
    width: calc(
      (100% / (var(--cur-count))) -
        (12px * (var(--cur-count) - 1) / (var(--cur-count)))
    ) !important;
    box-sizing: border-box;

    @media screen and (max-width: 900px) {
      @if $minCount == 1 {
        margin-right: 0;
      }
      @else {
        &:nth-of-type(#{$minCount}n) {
          margin-right: 0;
        }
      }
    }

    @media screen and (min-width: 901px) and (max-width: 1200px) {
      --cur-count: calc(var(--min-count, 1) + 1);
      &:nth-of-type(#{$minCount + 1}n) {
        margin-right: 0;
      }
    }

    @media screen and (min-width: 1201px) and (max-width: 1500px) {
      --cur-count: calc(var(--min-count, 1) + 2);
      &:nth-of-type(#{$minCount + 2}n) {
        margin-right: 0;
      }
    }

    @media screen and (min-width: 1501px) and (max-width: 2400px) {
      --cur-count: calc(var(--min-count, 1) + 3);
      &:nth-of-type(#{$minCount + 3}n) {
        margin-right: 0;
      }
    }

    @media screen and (min-width: 2401px) {
      --cur-count: calc(var(--min-count, 1) + 4);
      &:nth-of-type(#{$minCount + 4}n) {
        margin-right: 0;
      }
    }
  }
}

// 卡片列表
@mixin trigger-dynamic-card-list($minCount: 1, $itemClass: 'dynamic-card-list__item') {
  --min-count: #{$minCount};
  width: 100%;
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: space-between;

  &::after {
    content: '';
    flex: auto;
  }

  .#{$itemClass} {
    --cur-count: var(--min-count, 1);
    margin-bottom: 12px;
    margin-right: 12px;
    width: calc(
      (100% / (var(--cur-count))) -
        (12px * (var(--cur-count) - 1) / (var(--cur-count)))
    ) !important;
    box-sizing: border-box;

    @media screen and (max-width: 900px) {
      @if $minCount == 1 {
        margin-right: 0;
      }
      @else {
        &:nth-of-type(#{$minCount}n) {
          margin-right: 0;
        }
      }
    }
    
  }
  
}

// 表单列表
@mixin dynamic-form-list($itemClass: 'dynamic-form-list__item', $count:3) {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
  
	// &::after {
	//   content: '';
	//   flex: auto;
	// }
  
	>.#{$itemClass} {
    margin-bottom: 10px;
    margin-right: 20px;
    &:not(.bbx-form-item-i){
      width: calc(
        (100% / #{$count}) - 
        (20px * #{$count} / #{$count})
      ) !important;
    }
    box-sizing: border-box;
	}
}